<template>
    <div  class="svgMenu clear_float">
        <common id="nulll" ref='common'></common>
        <div @click="selectThis(index)" :class="indexIng==index?'active':''" v-for="(item , index) of imgAtrr" :key="index">
            <div>{{index}}</div>
            <div v-show="index=='预警'" class="svgMenuCons">{{warnNum[index]}}</div> 
            <div v-show="index!='预警'" class="svgMenuCons">{{item}}</div> 
        </div>
    </div>
    
    
</template>

<script>
import Vue from 'vue'
import VueModalTor from 'vue-modaltor';
import common from '../common'
Vue.use(VueModalTor);
export default {
    props:["blocksAll","warnNum"],
	components: {
        common,
    },
	data() {
		return {
            indexIng:"当前天气",
            type:"yu",
            imgAtrr:{
                "当前天气":"",
                "预警":"../../static/images/manage/warn.png",
                "近1小时全市面雨量":"",
                "近1小时全市极大风":"",
                "近24小时全市面雨量":"",
                "未来1小时全市面雨量":"",
                "未来1小时全市极大风":"",
                "未来24小时全市面雨量":"",
            },
            obj:{
                "绍兴":330600000,
                "越城":330602000,
                "上虞":330604000,
                "柯桥":330603000,
                "诸暨":330681000,
                "嵊州":330683000,
                "新昌":330624000,
            },
		}
	},
	methods:{
        selectThis(index){
            this.indexIng=index;
            console.log(this.indexIng);
            this.$emit('refreshSvg',this.indexIng)
        },
        getALLdata(){
            // 现在天气
           this.$ajax({method: 'get',	url: "http://172.21.129.101:8080/ZJDataCenter/api/SURF_Wea_Cbf_MUL_HOR/getSurfEleInRegionByTime?userid=wlzx&pwd=123&dataformat=json&elements=Lat,Lon,Station_Id_C,Station_name,WEP_Now&times=20190310200000&areacodes=330600000&limitCnt=10000",}).then((res)=>{
                var data=res.data.DS;
                console.log(data)
            })
            .catch(function(err){
                console.log(err)
            });
            
        // 近1小时全市面雨量
           this.$ajax({method: 'get',	url: "http://10.135.118.81/ExportDataV5/GetRegionAvgRain.ashx?ID=330600000&ip=10.135.30.116&port=8080&username=zjwlzx&pwd=123&interface=SURF_ZJ_GRID_MUL_HOR&api=getGridEleInRectByTimeAndLevelAndValidtime&time=20190309160000&prodcode=R1&level=0&hours=0",}).then((res)=>{
                var data=res.data.DS;
                this.imgAtrr["近1小时全市面雨量"]=data[0].Avg+"mm";
                // console.log(this.imgAtrr)
            })
            .catch(function(err){
                console.log(err)
            });
        // 近1小时全市极大风
            var time=this.$refs.common.getthisTime().slice(0,10)+"0000";
			if(time.slice(10,12)<10){
				time=this.$refs.common.getTimeCShow(time,-60);
			}
           this.$ajax({method: 'get',	url: "http://10.135.118.52:8080/ZJDataCenter/api/SURF_Wea_Cbf_MUL_HOR/getSurfEleInRegionByTime?userid=aa&pwd=123&dataformat=json&elements=observtimes,WIN_S_Inst_Max,WIN_D_Inst_Max,Station_name,TOWN_NAME,Alti&times="+time+"&itemlist=F&areacodes=3306&limitCnt=3000",}).then((res)=>{
                var data=res.data.DS;
                // console.log(data)
                data=data.sort(this.$refs.common.compare2("WIN_S_Inst_Max"));
                this.imgAtrr["近1小时全市极大风"]=parseFloat(data[0].WIN_S_Inst_Max)+"m/s";
            })
            .catch(function(err){
                console.log(err)
            });
        // 近24小时全市面雨量
           this.$ajax({method: 'get',	url: "http://10.135.118.81/ExportDataV5/GetRegionAvgRain.ashx?ID=330600000&ip=10.135.30.116&port=8080&username=zjwlzx&pwd=123&interface=SURF_ZJ_GRID_MUL_HOR&api=getGridEleInRectByTimeAndLevelAndValidtime&time=20190309160000&prodcode=R24&level=0&hours=0",}).then((res)=>{
                var data=res.data.DS;
                this.imgAtrr["近24小时全市面雨量"]=data[0].Avg+"mm";
                // console.log(this.imgAtrr)
            })
            .catch(function(err){
                console.log(err)
            });
        // 未来1小时全市面雨量
           this.$ajax({method: 'get',	url: "http://10.135.118.81/ExportDataV5/GetRegionAvgRain.ashx?ID=330600000&ip=10.135.30.116&port=8080&username=zjwlzx&pwd=123&interface=NAFP_FOR_FTM_ST24H_ZJ&api=getGridForecastEleGridInRectByTimeAndLevelAndValidtime&time=20190310150000&prodcode=apcpsfc&level=0&hours=1",}).then((res)=>{
                var data=res.data.DS;
                this.imgAtrr["未来1小时全市面雨量"]=data[0].Avg+"mm";
                // console.log(this.imgAtrr)
            })
            .catch(function(err){
                console.log(err)
            });
        // 未来1小时全市极大风
        //    this.$ajax({method: 'get',	url: "http://10.135.118.81/ExportDataV5/GetRegionAvgRain.ashx?ID=330600000&ip=10.135.30.116&port=8080&username=zjwlzx&pwd=123&interface=SURF_ZJ_GRID_MUL_HOR&api=getGridEleInRectByTimeAndLevelAndValidtime&time=20190309160000&prodcode=R24&level=0&hours=0",}).then((res)=>{
        //         var data=res.data.DS;
        //         var p;
        //         for(var i=0;i<data.length;i++){
        //             for(p in this.obj){
        //                 if(data[i].RegionCode==this.obj[p]){
        //                     this.mian1[p]=data[i].Avg;
        //                 }
        //             }
        //         };
        //         console.log(this.mian1)
        //     })
        //     .catch(function(err){
        //         console.log(err)
        //     });
        // 未来24小时全市面雨量
           this.$ajax({method: 'get',	url: "http://10.135.118.81/ExportDataV5/GetRegionAvgRain.ashx?ID=330600000&ip=10.135.30.116&port=8080&username=zjwlzx&pwd=123&interface=NAFP_FOR_FTM_ST24H_ZJ&api=getGridForecastEleGridInRectByTimeAndLevelAndValidtime&time=20190310150000&prodcode=apcpsfc&level=0&hours=24",}).then((res)=>{
                var data=res.data.DS;
                this.imgAtrr["未来24小时全市面雨量"]=data[0].Avg+"mm";
                // console.log(this.imgAtrr)
            })
            .catch(function(err){
                console.log(err)
            });
       }
        
    },
	mounted(){
        this.getALLdata();
	}
}
</script>

<style lang="less">

    .svgMenu{
        height: 100%;
        
        #nulll{
            display: none;
        }
        &>div{
            padding: 10px ;
            float: left;
            border: 1px solid #2A5C77;
            background: rgba(0, 0, 0, 0.15);
            box-shadow: 0 0 10px rgba(255,255,255, 0.2) inset;
            width: 12.5%;
            height: 100%;
            text-align: center;
            color: rgba(255,255,255, 0.5);
            cursor: pointer;
            position: relative;
            &:hover{
                color: yellow;
            }
        }
        .active{
            border: 1px solid #2A5C77;
            background: rgba(0, 0, 0, 0.15);
            box-shadow: 3px 3px 50px rgba(255,255,255, 0.5) inset;
            text-align: center;
            color: orange;
            &:hover{
                color: orange;
            }
            .svgMenuCons{
                color: orange;
            }
        }
        .svgMenuCons{
            position: absolute;
            bottom: 10px;
            color: #62DBE4;
            left: 0;
            width: 100%;
            font-size: 28px;
            text-align: center;
        }
    }
</style>
